.bgf {
    background-color: #fff;
}

.color-000 {
    color: #000;
}

.color-eab369 {
    color: #eab369;
}

.color-cd1a1a {
    color: #cd1a1a;
}

.font-size-(@n, @i: 1) when (@i <=@n) {
    .font-size-@{i} {
        font-size: @i * 1px;
    }

    .font-size-(@n, (@i + 1));
}

.font-size-(40);

.mt-(@n, @i: 0) when (@i <=@n) {

    .mt-@{i} {
        margin-top: @i * 1px;
    }

    .mb-@{i} {
        margin-bottom: @i * 1px;
    }

    .ml-@{i} {
        margin-left: @i * 1px;
    }

    .mr-@{i} {
        margin-right: @i * 1px;
    }

    .m-@{i} {
        margin: @i * 1px;
    }

    .pt-@{i} {
        padding-top: @i * 1px;
    }

    .pb-@{i} {
        padding-bottom: @i * 1px;
    }

    .pl-@{i} {
        padding-left: @i * 1px;
    }

    .pr-@{i} {
        padding-right: @i * 1px;
    }

    .p-@{i} {
        padding: @i * 1px;
    }

    .mt-(@n, (@i + 1));
}

.mt-(40);

.hr {
    border-bottom: 1px solid #F4F4F4;
}

.font-w-4 {
    font-weight: 400;
}

.font-w-5 {
    font-weight: 500;
}

.font-w-6 {
    font-weight: 600;
}

.border-r-8 {
    border-radius: 8px;
}

.flex-1 {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
}

.title-1 {
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
}

.title-2 {
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
}

.text-1 {
    font-size: 24px;
    color: black;
}

.text-right {
    text-align: right;
}

.width-200 {
    width: 200px;
}

.border-1 {
    border: 1px solid #F4F4F4;

    &:hover {
        border-color: #2293F8;
    }
}

body {

    .btn-warning,
    .btn-warning:active,
    .btn-warning:hover,
    .btn-warning:focus {
        background-color: #FF9800;
        border-color: #FF9800;
    }

    .btn-success,
    .btn-success:active,
    .btn-success:hover,
    .btn-success:focus {
        background-color: #64CC2E;
        border-color: #64CC2E;
    }

}